<template>
    <div class="con">  
        <van-swipe class="my-swipe" :autoplay="3000"  @change="onChange" :show-indicators='false'>
            <van-swipe-item>
                 <van-image                             
                         :src="require('@/assets/28 guidepage.png')"                                              
                          fit="cover" 
                        class="image"                                                                          
                 />       
            </van-swipe-item>
            <van-swipe-item>
                 <van-image                             
                         :src="require('@/assets/29 guidepage2.png')"                                              
                          fit="cover" 
                        class="image"                                                                          
                 />               
            </van-swipe-item>
            <van-swipe-item>
                 <van-image                             
                         :src="require('@/assets/30 guidepage3.png')"                                              
                          fit="cover" 
                        class="image"                                                                          
                 />              
            </van-swipe-item>
            <van-swipe-item>
                 <van-image                             
                         :src="require('@/assets/20 guidepage4.png')"                                              
                          fit="cover" 
                        class="image"                                                                          
                 />
    
            </van-swipe-item> 
             <van-swipe-item>
                 <van-image                             
                         :src="require('@/assets/-e-小饰品_icons.png')"                                              
                          fit="cover" 
                        class="image"                                                                          
                 />
                 <p>生活美学探索</p>
            </van-swipe-item> 
            <van-swipe-item>
                 <van-image                             
                         :src="require('@/assets/-e-小饰品_icons.png')"                                              
                          fit="cover" 
                        class="image"                                                                          
                 />
                 <p>生活美学探索</p>
            </van-swipe-item>                   
        </van-swipe>
    </div>
</template>
<script>
import { Toast } from 'vant'
export default {
   methods: {
    onChange(index) {
      const that = this
      console.log(index)
      if (index > 3){      
          that.$router.push('/login')                
      }
    }
  }
}
</script>
<style lang="less">
.con{
    .my-swipe .van-swipe-item {
        color: #fff;
        font-size: 20px;
        line-height: 150px;
        text-align: center;
        .image{
            width: 100%;
            height:1334px;
            display: block;
        }
  }
}
</style>
